<template>
  <div id="addBusiness" class="app-container">
    <el-tabs v-model="tap" type="card">
      <el-tab-pane label="基本信息" name="info"></el-tab-pane>
      <el-tab-pane label="标签配置" name="label"></el-tab-pane>
      <el-tab-pane label="推荐产品" name="intro"></el-tab-pane>
      <el-tab-pane label="返利产品" name="rebate"></el-tab-pane>
    </el-tabs>
    <info v-if="tap=='info'" @goTo="changeTap"></info>
    <businessLabel v-if="tap=='label'" @goTo="changeTap"></businessLabel>
    <introProduct v-if="tap=='intro'" @goTo="changeTap"></introProduct>
    <rebateProduct v-if="tap=='rebate'" @goTo="changeTap"></rebateProduct>
  </div>
</template>
<script>
import info from '../components/basicInfo'
import businessLabel from '../components/label'
import introProduct from '../components/introProduct'
import rebateProduct from '../components/rebateProduct'
export default {
  components: {
    info, businessLabel, introProduct, rebateProduct
  },
  data() {
    return {
      active: 4,
      tap: 'info'
    }
  },
  methods: {
    changeTap(tap) {
      console.log(tap)
      this.tap = tap
    }
  },
  beforeDestroy() {
    sessionStorage.removeItem('businessId')
    sessionStorage.removeItem('productId')
  }
}
</script>
<style lang="scss" scoped>
  #addBusiness{
    .stepper{
      width:400px;
      margin-left: 60px;
    }
  }
</style>
